<!DOCTYPE html>
<html>
<head>
    <title>楼盘图</title>
<#include "../common/common.ftl"/>
</head>
<body>
<div class="layui-fluid">
    <form class="layui-form">
        <div class="layui-card">
            <div class="layui-card-header">
                安置项目：<span class="jmdf-color-red">${(azProject.projectName)!}</span>
                <span style="position: absolute;right: 30px;">
                        <span class="layui-badge" style="background-color: green;">&nbsp;可选&nbsp;</span>
                        <span class="layui-badge" style="background-color: red;">&nbsp;已选&nbsp;</span>
                </span>
            </div>
            <div class="layui-card-body" style="height: 43px;margin-top: -15px;">
                <div class="layui-form-item">
                    <div class="layui-form-mid">
                        <#if (buildNumList??)>
                            <#list buildNumList as buildNum>
                                <a class="layui-btn loadBuild" buildNum="${(buildNum)!}"><i class="layui-icon layui-icon-home"></i>${(buildNum)!}幢</a>
                            </#list>
                        </#if>
                    </div>
                </div>
            </div>
        </div>

        <div class="layui-card">
            <div class="layui-card-body">
                <div class="layui-form-item">
                    <div class="layui-form-mid layui-col-md11" id="houseHoldInfo">

                    </div>
                </div>
            </div>
        </div>

        <div class="layui-card">
            <div class="layui-card-body">
                <div class="layui-form-item">
                    <div class="layui-form-mid layui-col-md12">
                        <div id="buildInfo">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>
<script src="/layui/layui.js" charset="utf-8"></script>
<script src="/modules/business/house.js" charset="utf-8"></script>
<script>
    layui.config({
        base: '/modules/' //静态资源所在路径
    }).use(['jquery','form','layer','jmdf'], function () {
        var $ = layui.jquery,form = layui.form,layer = layui.layer,jmdf = layui.jmdf;
        $(".loadBuild").click(function(){
            var obj = $(this);
            loadHousePicture("${(azProject.id)!}",obj.attr("buildNum"));
            aa("${(azProject.id)!}",obj.attr("buildNum"));
            $(".loadBuild").removeClass("layui-btn-danger");
            obj.addClass("layui-btn-danger")
        });

        //查询楼盘图数据
        function loadHousePicture(azProjectId, buildNum) {
            $.ajax({
                url:"loadHousePicture",
                type:"post",
                data:{azProjectId: azProjectId, buildNum: buildNum, _time: new Date().getTime()},
                success:function(data){
                    var pictureHtml = "";
                    pictureHtml = getChooseHousePicture(data);
                    $("#buildInfo").html(pictureHtml);
                    $(".houseStyle").click(function(){
                        var obj = $(this);
                        var houseStatus = obj.attr("houseStatus");
                        if (houseStatus != undefined ){
                            jmdf.view("houseView?houseId="+obj.attr("id"));
                        }
                    })
                }
            });
        }
        function aa(azProjectId,buildNum){
            $.ajax({
                url:"houseHoldInfo",
                type:"post",
                data:{azProjectId : azProjectId,buildNum:buildNum,_time:new Date().getDate()},
                success:function(data){
                    var houseHoldHtml = "";
                    houseHoldHtml = getHouseHold(data);
                    $("#houseHoldInfo").html(houseHoldHtml);
                }
            })
        }

        //封装户型统计查看表
        function getHouseHold(data){
            var houseHoldMap = data.houseHoldMap;
            var houseInfoMap = data.houseInfoMap;
            var houseHoldTotalMap = data.houseHoldTotalMap;
            var houseInfoHtml = "<div class='layui-container' style='width: 100%'> <table class='layui-table', style='text-align: center';>" +
                    "<tr class='layui-bg-gray'>" +
                    "<th style='text-align: center;'>居室类型</th>" +
                    "<th style='text-align: center;'>总房屋数量</th>" +
                    "<th style='text-align: center;'>总房屋建筑面积/㎡</th>" +
                    "<th style='text-align: center;'>已选房屋数量</th>" +
                    "<th style='text-align: center;'>已选房屋面积/㎡</th>" +
                    "<th style='text-align: center;'>未选房屋数量</th>" +
                    "<th style='text-align: center;'>未选房屋面积/㎡</th>" +
                    "</tr>";

            for (var key in houseInfoMap) {
                houseInfoHtml = houseInfoHtml +
                        "<tr class='layui-bg-gray'>" +
                        "<th style='text-align: center;'>" + houseHoldMap[key] + "</th>" +
                        "<th style='text-align: center;'>" + houseInfoMap[key]['houseCountSum'] + "</th>" +
                        "<th style='text-align: center;'>" + houseInfoMap[key]['buildAreaSum'] + "</th>" +
                        "<th style='text-align: center;'>" + houseInfoMap[key]['houseCountSumYes'] + "</th>" +
                        "<th style='text-align: center;'>" + houseInfoMap[key]['buildAreaYes'] + "</th>" +
                        "<th style='text-align: center;'>" + houseInfoMap[key]['houseCountSumNo'] + "</th>" +
                        "<th style='text-align: center;'>" + houseInfoMap[key]['buildAreaNo'] + "</th>" +
                        "</tr>";
            }

            houseInfoHtml = houseInfoHtml +
                    "<tr class='layui-bg-gray'>" +
                    "<th style='text-align: center;'>合计</th>" +
                    "<th style='text-align: center;'>" + houseHoldTotalMap['houseCountSumTotal'] + "</th>" +
                    "<th style='text-align: center;'>" + houseHoldTotalMap['buildAreaSumTotal'] + "</th>" +
                    "<th style='text-align: center;'>" + houseHoldTotalMap['houseCountSumYesTotal'] + "</th>" +
                    "<th style='text-align: center;'>" + houseHoldTotalMap['buildAreaYesTotal'] + "</th>" +
                    "<th style='text-align: center;'>" + houseHoldTotalMap['houseCountSumNoTotal'] + "</th>" +
                    "<th style='text-align: center;'>" + houseHoldTotalMap['buildAreaNoTotal'] + "</th>" +
                    "</tr>";
                    "</table></div>";
            return houseInfoHtml;
        }
        window.loadHousePicture = loadHousePicture;
    });
</script>
</body>
</html>